=<template>
  <!--按钮-->
  <div>
    <el-button type="danger" :icon="Plus" @click="SaveBreedingSow"
      >新增</el-button
    >
    <el-button type="danger" :icon="DocumentAdd" disabled>保存</el-button>
    <el-button type="danger" :icon="BottomRight" disabled>撤销</el-button>
    <el-button type="danger" :icon="Delete" disabled>删除</el-button>
  </div>

  <div style="margin-top: 20px; margin-bottom: 20px">
    <span>断奶日期&nbsp;{{ form[0].weaningDate }}</span>
    <span style="margin-left: 100px">单据号&nbsp;-- --</span>
    <span style="margin-left: 100px">流水号&nbsp;-- --</span>
  </div>
  <hr size="6" style="background-color: rgb(232.8, 233.4, 234.6)" />
  <!--表格-->
  <table>
    <tr>
      <td width="180">序号</td>
      <td width="180">猪只耳号</td>
      <td width="180">性别</td>
      <td width="180">当前栋舍</td>
      <td width="180">当前栏位</td>
      <td width="180">转入栋舍</td>
      <td width="180">转入栏位</td>
      <td width="180">断奶重量(公斤)</td>
    </tr>

    <tr v-for="(item, index) in form" :key="index">
      <td width="180"><el-input :value="index + 1" /></td>
      <td width="180">
        <el-select v-model="item.basicInforId" placeholder="请选择" clearable @change="handlebedroomField(item.basicInforId,index)">
          <el-option v-for="basic in basicInforList.filter((d:any)=>d.pigTypeId==3)" :key="basic.basicInforId" :label="basic.earNumber" :value="basic.basicInforId"/>
        </el-select>
      </td>
      <td width="180">
        <el-tag type="primary" v-if="item.gender==1">公</el-tag>
        <el-tag type="danger" v-else-if="item.gender==2">母</el-tag>
      </td>
      <td width="180">
        {{ item.currentbuilding }}
      </td>
      <td width="180">
        {{ item.currentfield }}
      </td>
      <td width="180">
        <el-select v-model="item.transferbuilding" placeholder="请选择" @change="handlefield(item.transferbuilding, index)" clearable>
          <el-option v-for="bedroom in bedroomList" :key="bedroom.bedroomId" :label="bedroom.bedroomName" :value="bedroom.bedroomId"/>
        </el-select>
      </td>
      <td width="180">
        <el-select v-model="item.transferfield" placeholder="请选择" clearable>
          <el-option v-for="field in fieldList[index]" :key="field.fieldId" :label="field.fieldName" :value="field.fieldId"/>
        </el-select>
      </td>
      <td width="180"><el-input v-model="item.weaningWeight" /></td>
    </tr>
  </table>
  <!--增行 删行-->
  <div>
    <el-button type="danger" link @click="addRow">+增行</el-button>
    <el-button type="danger" link @click="removeRow" :disabled="form.length <= 0">-删行</el-button>
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted, reactive } from "vue";
import { ElMessage } from "element-plus";
import axios from "axios";
import { useRouter, useRoute } from "vue-router";
import {Plus,Delete,DocumentAdd,BottomRight,} from "@element-plus/icons-vue";

const apiUrl = import.meta.env.VITE_APP_API_URL;
const apiBedinUrl = import.meta.env.VITE_APPRead_API_URL;

const router = useRouter();
const route = useRoute();

const size = ref<"default" | "large" | "small">("default");

//当前时间
const date = new Date();

//响应式数据 获取栋舍
const condition = reactive({
  pageIndex: 1,
  pageSize: 100,
  bedroomTypeId: 0,
  bedroomName: "",
  personName: "",
});

//初始化表单和栋舍栏位列表
const form = reactive([
  {
    pigletsWeaningId: 0,
    basicInforId: "",
    gender: 0,
    currentbuilding: "",
    currentfield:"",
    transferbuilding: 0,
    transferfield: 0,
    weaningDate: date.getFullYear()+'-'+(date.getMonth()+1).toString().padStart(2, '0')+'-'+ date.getDate().toString().padStart(2, '0'),
    weaningWeight: 0,
    documentNo: "",
    serialNo: "",
    createdOwner: localStorage.getItem("userName"),
    createdTime: new Date(),
    updateOwner: "",
    updatedTime: null,
    examineOwner: "",
    examineTime: null,
  },
]);



//增行 删行
const addRow = () => {
  form.push({
    pigletsWeaningId: 0,
    basicInforId: "",
    gender:0,
    currentbuilding: "",
    currentfield:"",
    transferbuilding: 0,
    transferfield: 0,
    weaningDate:  date.getFullYear()+'-'+(date.getMonth()+1).toString().padStart(2, '0')+'-'+ date.getDate().toString().padStart(2, '0'),
    weaningWeight: 0,
    documentNo: "",
    serialNo: "",
    createdOwner: localStorage.getItem("userName"),
    createdTime: new Date(),
    updateOwner: "",
    updatedTime: null,
    examineOwner: "",
    examineTime: null,
  });
  console.log(form);
};

//删行
const removeRow = () => {
  if (form.length > 0) {
    form.pop();
  }
};

//新增
const SaveBreedingSow = () => {
  console.log(form);
  const obj = {
    pigletsWeanings: form,
  };
  axios
    .post(apiBedinUrl+"/api/PigletsWeanings/AddPigletsWeaning", obj)
    .then((res) => {
      if (res.data.code == 0) {
        ElMessage.success("添加仔猪断奶成功");
        router.push('/PigsWeaningList');
      } else {
        ElMessage.error("添加仔猪断奶失败");
      }
    });
};

//获取耳号
const basicInforList: any = ref([]);
const handlebasicInfor = () => {
  axios.post(apiBedinUrl+"/api/Basics/SearchBasic", {}).then((res) => {
    basicInforList.value = res.data.data;
  });
};

//获取当前栋舍 栏位
const bedroomField:any = reactive({
  gender: '',
  currentbuilding: '',
  currentfield:'',
});
//将该方法放在耳号下拉框 变化的时候将id值与下标传过来了
const handlebedroomField = (id:number,index:number) => {
  axios.post(apiBedinUrl+"/api/Basics/SearchBedroomField", {
    //根据耳号id进行获取
    basicInforId:id
  }).then((res) => {
    console.log(res.data.data)
    //给栋舍 栏位 性别赋值
    bedroomField.gender=res.data.data.gender;
    bedroomField.currentbuilding=res.data.data.bedroomName;
    bedroomField.currentfield=res.data.data.fieldName;
    console.log(bedroomField)
    //根据下标进行赋值
    form[index].gender=bedroomField.gender;
    form[index].currentbuilding=bedroomField.currentbuilding;
    form[index].currentfield=bedroomField.currentfield;
    console.log(form)
  });
};


//获取栋舍
const bedroomList: any = ref([]);
const handleBedroom = () => {
  axios
    .post(apiUrl+"/api/BedRoom/ShowBedroom", {
      pageIndex: condition.pageIndex,
      pageSize: condition.pageSize,
      bedroomTypeId: condition.bedroomTypeId,
      bedroomName: condition.bedroomName,
      personName: condition.personName,
    })
    .then((res) => {
      bedroomList.value = res.data.data.list;
    });
};

//获取栏位
const fieldList: any = ref([]);
const handlefield = (id: number, index: number) => {
  form[index].transferfield = "";
  axios
    .post(apiUrl+"/api/BedRoom/GetBrdroomIdField", {
      bedroomId: id,
    })
    .then((res) => {
      fieldList.value[index] = res.data.data;
    });
};
//生命周期钩子
onMounted(() => {
  handlebasicInfor();
  handleBedroom();
});
</script>

<style scoped></style>
